@charset "utf-8";

$font-size:40;
@function px($px){
    @return ($px/2);
}
@function r($px){
    @return $px/$font-size*1rem;
}
header{
    width: 100%;
    
}
.backbtn{
    width: r(121);
    height: r(54);
    border: 1px solid #FF9344;
    text-align: center;
    line-height: r(60);
    border-radius: r(13);
    margin-top: r(48);
    margin-left: r(23);
    font-size: r(25);
}
header h3{
    text-align: center;
    font-size: r(26);
    font-weight: normal;
    margin-top: r(65);
}

section{
    width:100% ;
    
    
     .swiper-container {
                width: 90%; 
                margin: 0 auto; 
            }
             .swiper-slide { 
                 width: 100%;
                text-align: center;
         .fenleibannerps{
            width: 80%;
            float: left;
            text-align: center;
            img{
                width: 100%;
                height: 100%;
            }
            span{
                font-size: r(26);
                
            }
            &:nth-of-type(2),&:nth-of-type(3),&:nth-of-type(4){
                margin-left: r(38);
                
            }
            
        }
                
            }
        }
//  .fenleibanner{
//      width: 90%;
//      margin: 0 auto;
//      .fenleibannerps{
//          width: 20%;
//          float: left;
//          text-align: center;
//          img{
//              width: 100%;
//              height: 100%;
//          }
//          span{
//              font-size: r(26);
//              
//          }
//          &:nth-of-type(2),&:nth-of-type(3),&:nth-of-type(4){
//              margin-left: r(38);
//              
//          }
//          
//      }
//  }
//}
//.fenlei-circle{
//  width:18%;
//  margin: r(15) auto;
//  .yuandian{
//      width: r(18);
//      height: r(18);
//      border-radius: 50%;
//      background: #ff9344;
//      float: left;
//  }
//  .yuandian2{
//       width: r(18);
//      height: r(18);
//      border-radius: 50%;
//      background: #ffc9a1;
//      float: left;
//      margin-left: r(8);
//      
//  }
//}


.food-title{
    width: 95%;
    height: r(44);
    margin: 0 auto;
    .food-icon{
        width: r(56);
        height: r(44);
        float: left;
        padding-left: r(21);
        img{
            width: 100%;
            height: 100%;
        }
    }
    
    h3{
        font-size: r(31);
        float: left;
        margin-left: r(8);
         line-height: r(44);
    }
    h5{
        font-size: r(24);
        float: right;
        line-height: r(44);
        margin-right: r(6);
    }
    .icon-you{
        color: #ff3944;
        float: right;
        line-height: r(44);
        padding-right: r(21);
        font-size: r(25);
      
    }
}
.food-list{
    width: 90%;
    margin: r(37) auto;
    .food-photo{
        width: 20%;
        float: left;
        img{
            width: 100%;
        }
        &:nth-of-type(2),&:nth-of-type(3),&:nth-of-type(4){
            margin-left: r(44);
        }
    }
}
.sport-title{
    width: 95%;
    height: r(58);
    margin: 0 auto;
    .sport-icon{
        width: r(47);
        height: r(58);
        float: left;
        padding-left: r(21);
        img{
            width: 100%;
            height: 100%;
        }
    }
    
    h3{
        font-size: r(31);
        float: left;
        margin-left: r(8);
         line-height: r(58);
    }
    h5{
        font-size: r(24);
        float: right;
        line-height: r(58);
        margin-right: r(6);
    }
    .icon-you{
        color: #ff3944;
        float: right;
        line-height: r(58);
        padding-right: r(21);
       font-size: r(25);
    }
}
.movie-title{
    width: 95%;
    height: r(52);
    margin: 0 auto;
    .movie-icon{
        width: r(53);
        height: r(52);
        float: left;
        padding-left: r(21);
        img{
            width: 100%;
            height: 100%;
        }
    }
    
    h3{
        font-size: r(31);
        float: left;
        margin-left: r(8);
         line-height: r(52);
    }
    h5{
        font-size: r(24);
        float: right;
        line-height: r(52);
        margin-right: r(6);
    }
    .icon-you{
        color: #ff3944;
        float: right;
        line-height: r(52);
        padding-right: r(21);
       font-size: r(25);
    }
}